// components/image-scale/index.js
const componentBehavior = require('../../js/common/ComponentBehavior')

Component({
  /**
   * 组件的属性列表
   */
  properties: {
    src: {
      type: String,
      value: '' 
    },
    imgwidth: {
      type: Number,
      value: 0
    },
    imgheight: {
      type: Number,
      value: 0
    },
    previewImage: { // 是否禁止点击图片预览
      type: Boolean,
      value: true
    }
  },

  /**
   * 组件的初始数据
   */
  data: {

  },
  behaviors: [componentBehavior],
  /**
   * 组件的方法列表
   */
  methods: {
    imageLoad: function (e) {
      
      if (this.data.imgwidth > 0 && this.data.imgheight > 0) return;
      
      var imgwidth = e.detail.width * 2,
        imgheight = e.detail.height * 2,
        //宽高比
        ratio = imgwidth / imgheight;
      if (imgwidth >= 750) {
        var viewHeight = 750 / ratio;
        var imgheight = viewHeight;
        this.setData({
          imgwidth: 750,
          imgheight: imgheight
        })
      }
      else {
        this.setData({
          imgwidth: imgwidth,
          imgheight: imgheight
        })
      }
    },
    imageTab:function(e){
      let img = e.target.dataset.src;
      // 禁止点击图片预览
      // 如：当图片组件被需要点击跳转的内容包裹时，点击后应该直接打开页面，而不是预览图片
      if (!this.data.previewImage) {
        return
      }
      wx.previewImage({
        current: img, // 当前显示图片的http链接
        urls: [img] // 需要预览的图片http链接列表
      })
    }
  }
})
